<template>
	<view>
		<view class="uni-container">
			<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据"
				@selection-change="selectionChange">
				<uni-tr>
					<uni-th width="100" align="center">操作</uni-th>
					<uni-th width="110" align="center">日期</uni-th>
					<uni-th width="60" align="center">成交</uni-th>
					<uni-th width="60" align="center">大盘</uni-th>
					<uni-th width="60" align="center">沪深</uni-th>
					<uni-th width="60" align="center">上涨</uni-th>
					<uni-th width="60" align="center">下跌</uni-th>
					<uni-th width="60" align="center">涨停</uni-th>
					<uni-th width="60" align="center">跌停</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in tableData" :key="index">
					<uni-td>
						<view class="uni-group">
							<button @click="navigateTo(item)" class="uni-button" size="mini" type="primary">修改</button>
						</view>
					</uni-td>
					<uni-td align="center">{{ item.tradeDate }}</uni-td>
					<uni-td align="center">{{ item.turnover }}</uni-td>
					<uni-td align="center">{{ item.shSzNetInflow }}</uni-td>
					<uni-td align="center">{{ item.hkNetInflow }}</uni-td>
					<uni-td align="center">{{ item.riseNum }}</uni-td>
					<uni-td align="center">{{ item.fallNum }}</uni-td>
					<uni-td align="center">{{ item.riseStopNum }}</uni-td>
					<uni-td align="center">{{ item.fallStopNum }}</uni-td>
				</uni-tr>
			</uni-table>
			<view class="uni-pagination-box">
				<uni-pagination show-icon :pageSizeRange="[31, 50, 100, 500]" show-page-size :page-size="queryParams.pageSize" v-model="queryParams.pageNum"
					:total="total" @change="onPageChanged" @pageSizeChange="onPageSizeChange"/>
			</view>
			
		</view>
	</view>
</template>

<script>
	import {
		listStockRiseFallNum
	} from "@/api/eye/stockRiseFallNum"
	import {
		tansParams
	} from '@/utils/common'
	export default {
		data() {
			return {
				refreshFlag: false,
				searchVal: '',
				tableData: [],

				// 数据总量
				total: 0,
				loading: false,
				// 查询参数
				queryParams: {
					// 当前页
					pageNum: 1,
					// 每页数据量
					pageSize: 31,

					stockCode: null
				}
			}
		},
		onLoad() {
			console.log('onLoad')
			this.selectedIndexs = []
			this.getData(1)
		},
		onShow() {
			console.log('onShow')
			console.log(this.refreshFlag)
			if (this.refreshFlag) {
				listStockRiseFallNum(this.queryParams).then(res => {
					this.tableData = res.rows
					this.total = res.total
					this.loading = false
				})
			}
		},
		methods: {
			// 多选处理
			selectedItems() {
				return this.selectedIndexs.map(i => this.tableData[i])
			},
			// 多选
			selectionChange(e) {
				console.log(e.detail.index)
				this.selectedIndexs = e.detail.index
			},
			//批量删除
			delTable() {
				console.log(this.selectedItems())
			},
			// 分页触发
			onPageChanged(e) {
				this.$refs.table.clearSelection()
				this.selectedIndexs.length = 0
				this.queryParams.pageNum = e.current
				this.getData(e.current)
			},
			onPageSizeChange(pageSize) {
				console.log('切换页面Size:' + pageSize)
				this.queryParams.pageSize = pageSize
				this.queryParams.pageNum = 1
				this.$nextTick(() => {
					this.getData()
				})
			},
			// 搜索
			search() {
				this.getData(1, this.searchVal)
			},
			// 获取数据
			getData(pageNum, value = '') {
				this.loading = true
				listStockRiseFallNum(this.queryParams).then(res => {
					this.tableData = res.rows
					this.total = res.total
					this.loading = false
				})
			},
			navigateTo(item) {
				let url = '/pages/stock/overview/form' + '?' + tansParams(item)
				console.log(url)
				uni.navigateTo({
					url: url
				})
			},
		}
	}
</script>

<style>
	/* #ifndef H5 */
	/* page {
	padding-top: 85px;
} */
	/* #endif */
	.uni-group {
		display: flex;
		align-items: center;
	}
</style>
